svelte basic

• let : reactive variable 선언. 값 변경은 대입으로 이뤄져야함
• $: : reactive 쿼리. block 스코프, condition 지정 가능
• export let : props 선언 여기서 대입하면 기본값
• {#if} ... {/if} : 블록 조건
  • {:else} , {else if expr }
• {#each items as item, i} ... {/each}
  • (thing.id) : key DOM block
  • 없을 경우 데이터는 첫번째게 삭제되는데 DOM은 마지막게 삭제된다. 이를 일치 시켜줌
• {#await promise} {:then number} {:catch error} {/await}
  • {#await promise then number} {/await}
• on:event={handler}
  • ...|once
  • ...|preventDefault
  • ...|stopPropagation
  • ...|passive : 스크롤 개선
  • ...|nonpassive
  • 체이닝 가능
  • event forwarding (DOM event, message)
• bind:value DOM event의 속성이랑 선언된 reactive변수를 묶어줌
• bind:group input의 값은 유지하고 변수에 할당하고 싶을 때
• lifecycle: onMount, onDestory
• props랑 DOM 값 bind할때 {name} 이런식으로 shorthand